<style>
     @media screen and (max-width: 500px) {
        .layui-table-view {
            width: 100% !important;
            overflow-x: scroll !important;
            left: 0 !important;
        }

        .layui-table-box {
            width: 1400px !important;
            box-sizing: border-box;
        }
    }
</style>
<!--<form class="layui-form seller-form">-->
    <!--<div class="layui-form-item">-->

        <!--<div class="layui-inline">-->
            <!--<button type="button" class="layui-btn layui-btn-sm add-store"><i class="layui-icon">&#xe608;</i> 添加</button>-->
        <!--</div>-->

    <!--</div>-->
<!--</form>-->

<div class="table-body">
    <table class="layui-table" id="storeTable" lay-filter="storeTable"></table>
</div>

<script>
    layui.use(['table','layedit', 'laydate','form'], function(){
        var table = layui.table,form = layui.form;

        table.render({
            elem: '#storeTable',
            height: 'full-220',
            cellMinWidth: '80',
            page: 'true',
            limit:'20',
            id:'storeTable',
            url: "{:url('Store/index')}",
            cols: [[ //标题栏
                {type: 'numbers'},
                {field: 'name', width:200, title: '商户名称'},
                {field: 'username', width:200, title: '营业者姓名'},
                {field: 'brand', width:200, title: '品牌名称'},
                {field: 'cardImg', title: '身份证' ,align:'center',width:100, templet: function(data){
                    return '<a href="javascript:void(0);" onclick=viewImage("'+data.cardImg+'")><image style="max-width:30px;max-height:30px;" src="'+data.cardImg+'"/></a>';
                }},
                {field: 'licenseImg', title: '营业执照' ,align:'center',width:100, templet: function(data){
                    return '<a href="javascript:void(0);" onclick=viewImage("'+data.licenseImg+'")><image style="max-width:30px;max-height:30px;" src="'+data.licenseImg+'"/></a>';
                }},
                {field: 'area', title: '区域'},
                {field: 'ctime', sort: true, width:200, title: '创建时间',align:'center'},
                {field: 'utime', sort: true, width:200, title: '更新时间',align:'center'},
                {title:'操作',align:'center',toolbar:'#storeBar',width: 190},{templet:function(data){
                        var html = '';
                        if(data.status == 1 || data.status == 4){
                            html += '<a  class="layui-btn layui-btn-xs option-no" data-status="2" data-id="' + data.id + '">待审核</a>';
                        }else if(data.status == 2){
                            html += '<a  class="layui-btn layui-btn-xs" data-status="2" data-id="' + data.id + '">审核通过</a>';
                        }else if(data.status == 3){
                            html += '<a  class="layui-btn layui-btn-xs" data-status="3" data-id="' + data.id + '">审核未通过</a>';
                        }else if(data.status == 4){
                            html += '<a  class="layui-btn layui-btn-xs" data-status="4" data-id="' + data.id + '">通过</a>';
                        }
                        return html;
                    }}
            ]] //设置表头
        });

        $(document).on('click','.add-store',function(){
           window.location.href = "{:url('Store/add')}";
        });

        //监听工具条
        table.on('tool(storeTable)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）

            if(layEvent === 'del'){ //删除
                layer.confirm('真的删除么',{icon:3}, function(index){
                    JsGet("{:url('Store/del')}?id="+data.id,function(res){
                        if(res.status){
                            obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                            layer.close(index);//向服务端发送删除指令
                        }
                        layer.msg(res.msg);
                    });
                });
            } else if(layEvent === 'edit'){
                window.location.href = "{:url('Store/edit')}?id="+data.id;
            }
            else if(layEvent === 'stateedit'){
                window.location.href = "{:url('Store/storestate_info')}?id="+data.id;
            }
            else if(layEvent === 'clerk'){
                window.location.href = "{:url('Store/clerkList')}?id="+data.id;
            }
        });

        //审核
        $(document).on('click','.option-no',function(data){
            var id = $(this).attr('data-id');
            layer.confirm('商户审核', {
                btn: ['通过','拒绝'] //按钮
            }, function(){
                JsPost("{:url('audit')}",{'id':id,'status':2},function(res){
                    if(res.status){
                        layer.msg('操作成功');
                        window.location.reload();
                    }else{
                        layer.msg(res.msg);
                    }
                });
            }, function(){
                JsPost("{:url('audit')}",{'id':id,'status':3},function(res){
                    if(res.status){
                        layer.msg('操作成功');
                        window.location.reload();
                    }else{
                        layer.msg(res.msg);
                    }
                });
            });
        });
    });
</script>

<script type="text/html" id="storeBar">
    <a class="layui-btn layui-btn-xs" lay-event="clerk">店员列表</a>
    <!--<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>-->
    <a class="layui-btn layui-btn-xs" lay-event="stateedit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
